<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="../cordova.js"></script>
    <script type="text/javascript" src="accessAuth_ajax.js"></script>
    <script type="text/javascript" src="../butterfly/vendor/jquery/jquery.js"></script>
    <meta charset="utf-8"/>

    <title>Hello World</title>
    <link rel="stylesheet" type="text/css" href="register.css">
    <!--<link rel="stylesheet" type="text/css" href="../ratchet/css/ratchet.min.css">-->
    <!--<link rel="stylesheet" type="text/css" href="../ratchet/css/ratchet-theme-android.min.css">-->
</head>
<body>
<h3>变色龙设备管理平台</h3>

<div>
    <label for="email">用户名:</label>
    <input type="text" class="form-control" id="email" name="username" class="span3" value=""/>
</div>

<div>
    <label for="password">密码：</label>
    <input type="password" class="form-control" id="password" name="password" class="span3" value=""/>
</div>

<div id="ssInput">
    <label>设备类型:</label><br/>

    <div style="margin-top: 10px"/>
    <!--// 0：公司设备(默认)  1：个人设备 -->
    <!--style="display: inline;width: 1%;border: 0px;margin: 12px "-->
    <input style="display: inline;border: 0px;margin: 0px 12px 0px 12px" type="radio" name="type" id="company" value="0"
           checked="checked"/>
    <label for="company" style="padding: 5px;margin: 0px,0px,0px,0px">公司设备</label><br/>
    <input style="display: inline;border: 0px;margin:0px 12px 0px 12px" type="radio" name="type" id="person" value="1"/>
    <label for="person" style="padding: 5px;margin: 0px,0px,0px,0px">个人设备</label>
    <!--个人设备-->
</div>
<br/>

<div id="personSscode">
    <label for="ssCode">自助服务码:</label>
    <input type="text" class="form-control" id="ssCode" name="username" class="span3" value=""/>
</div>

<button class="btn btn-info" id="reg">认证</button>
<button class="btn btn-info" id="logout">注销</button>
<div class="panel">
    <div class="panel-heading">
        备注
    </div>
    <div class="panel-footer" id="showMsg">请进行登录</div>
</div>

<script type="text/javascript">
    document.addEventListener("deviceready", function () {
        /**
         * 检测用户输入
         */
        function checkInput() {
            console.log("checkInput");
            var regInfo = {};

            regInfo.email = $("#email").val();
            if (regInfo.email === '') {
                alert("邮箱不能为空");
                return;
            }

            regInfo.password = $("#password").val();
            if (regInfo.password === '') {
                alert("密码不能为空");
                return;
            }

            // 认证未通过，则需要设置设备类型
            if (!localStorage.regCode) {
                // 个人设备，必须填写 ssCode
                regInfo.type = Number($("input:radio[name='type']:checked").val());
                console.log('type=' + regInfo.type);

                if (regInfo.type === 1) {
                    regInfo.ssCode = $("#ssCode").val();
                    if (regInfo.ssCode === '') {
                        alert("自助服务码不能为空");
                        return;
                    }
                }
            }
            console.log("-------input----\n" +
                            "email=" + regInfo.email + "\n" +
                            "password=" + regInfo.password + "\n" +
                            "type=" + regInfo.type + "\n" +
                            "ssCode=" + regInfo.ssCode + "\n" +
                            "-------check input----\n"
            );
            return regInfo;
        }

        $("#company").click(function () {
            $("#personSscode").hide();
        });
        $("#person").click(function () {
            $("#personSscode").show();
        });

        var showMsg = document.getElementById("showMsg");
        var btnLogin = document.getElementById("reg");
        var btnLogout = document.getElementById("logout");
        var inputEmail = document.getElementById("email");
        var inputPwd = document.getElementById("password");

        function switchStatus(enableClick) {
            if (!enableClick) {
                btnLogin.style.pointerEvents = 'none';
                btnLogout.style.pointerEvents = 'none';
            } else {
                btnLogin.style.pointerEvents = 'auto';
                btnLogout.style.pointerEvents = 'auto';
            }
        }

        function succ() {
            setTimeout(accessAuth.allOk, 1000);
            showMsg.innerHTML = "正在跳转...";
        }

        function fail(errMsg) {
            console.log("fail,err=" + errMsg);
            showMsg.innerHTML = errMsg;
            switchStatus(true);
        }

        btnLogin.onclick = function () {
            var regInfo = checkInput();

            if (!regInfo) {
                return;
            }

            switchStatus(false);
            showMsg.innerHTML = "正在连接...";
//            var email = inputEmail.value;
//            var pwd = inputPwd.value;
//            console.log("email =" + email);
//            console.log("pwd =" + pwd);

            accessAuth.regAndCheckin(regInfo, succ, fail, true);
        }

        btnLogout.onclick = function () {
            showMsg.innerHTML = "已经登出，请重新登录";
            inputEmail.value = '';
            inputPwd.value = '';
            accessAuth.logout();
            // refresh
            window.location.reload();
        }

        // 默认值
        showMsg.innerHTML = accessAuth.getErrMsg();
        $("#personSscode").hide(); // 默认隐藏


        inputEmail.value = accessAuth.getAuthEmail(); //896859623@qq.com
        inputPwd.value = accessAuth.getAuthPwd();//ct
//        inputEmail.value = '896859623@qq.com';
//        inputPwd.value = 'ct';
        // 已经通过认证,则无须展示ssInput
//        if (localStorage.regCode) {
//            $("#ssInput").hide();
//        }

    }, false);
</script>
</body>
</html>
